<template>
    <n-data-table ref="table" :columns="columns" :data="columnsData" size="small" />
    <AddNote v-if="addNoteShow" :entityId="props.entityId" :entityName="props.entityName"
        @closeDrawer="addNoteShow = false" />
</template>

<script lang="ts" setup>
import { ref, onMounted,Component } from 'vue'
import { NDataTable, NButton, useMessage, NIcon } from 'naive-ui'
import type { DataTableColumn } from 'naive-ui'
import { NotificationsCircleOutline as NotificationsCircle } from '@vicons/ionicons5'
import { h } from 'vue'
import requset from "@/utils/requset"
import type { response } from "@/utils/requset"
import type { algorithmResopne, equipmentResopne, noteResopne } from "@/utils/interfaces/respone"
import noteTypeTag from './noteTypeTag.vue'
import equipmentTypeTag from './equipmentTypeTag.vue'
import algorithmTypeTag from './algorithmTypeTag.vue'
import AddNote from './addNote.vue'
import { inject } from "vue";

const reload = inject("reload", () => { });

const message = useMessage();

const props = defineProps<{
    entityId: number | undefined,
    entityName: string | undefined,
}>()

const addNoteShow = ref<boolean>(false)

const columns = ref<DataTableColumn[]>([
    {
        title: 'tag',
        key: 'tag',
        children: [
            {
                title: '状态',
                key: 'type',
                width: 1,
                render(row) {
                    return h(
                        noteTypeTag  as Component,
                        {
                            type: row.type
                        }
                    )
                },
            },
            {
                title: '所用算法',
                key: 'algorithm',
                className: 'algorithmResopne',
                width: 1,
                render(row) {
                    let algorithm: algorithmResopne = <algorithmResopne>row.algorithm
                    return h(
                        algorithmTypeTag,
                        {
                            type: algorithm.type,
                            name: algorithm.name
                        },
                        { default: () => "" }
                    )
                },
            },
            {
                title: '所用设备',
                key: 'equipment',
                className: 'equipmentResopne',
                width: 1,
                render(row) {
                    let equipment: equipmentResopne = <equipmentResopne>row.equipment
                    return h(
                        equipmentTypeTag,
                        {
                            type: equipment.type,
                            name: equipment.name
                        },
                        { default: () => "" }
                    )
                },
            },
        ]
    },

    {
        title: '内容',
        key: 'content',
    },
    {
        title: 'DAK',
        key: 'dak',
        children: [
            {
                title: 'D',
                key: 'd',
                width: 1,
            },
            {
                title: 'A',
                key: 'a',
                width: 1,
            },
            {
                title: 'K',
                key: 'k',
                width: 1,
            }
        ]
    },
    {
        title: () => h(
            NButton,
            {
                size: 'small',
                onClick: () => {
                    addNoteShow.value = !addNoteShow.value
                }
            },
            { default: () => '添加日志' }
        ),
        key: 'actions',
        render(row) {
            let noteId: number = <number>row.noteId
            return h(
                NButton,
                {
                    size: 'small',
                    onClick: () => deleteNote(noteId)
                },
                { default: () => '删除' }
            )
        },
        width: 1,
    }
])

interface columns {
    noteId: number,
    type: number,
    algorithm: algorithmResopne,
    equipment: equipmentResopne,
    content: string,
    d: number,
    a: number,
    k: number
}

const columnsData = ref<columns[]>([])

onMounted(() => {
    requset.get('/project/getNoteByEntityId', {
        entityId: props.entityId
    }).then((res: response<noteResopne[]>) => {
        if (res.status !== 200) {
            return;
        }
        let data = res.data.data;
        data.forEach((note) => {
            let column: columns = {
                noteId: note.noteId,
                type: note.type,
                algorithm: {
                    id: note.algorithmId,
                    name: note.algorithmName,
                    type: note.algorithmType,
                },
                equipment: {
                    id: note.equipmentId,
                    name: note.equipmentName,
                    type: note.equipmentType
                },
                content: note.content,
                d: note.dak >= 4 ? 1 : 0,
                a: note.dak % 4 >= 2 ? 1 : 0,
                k: note.dak % 2,
            }
            columnsData.value.push(column);
        })
    })
})

function deleteNote(noteId: number) {
    requset.post('/project/deleteNote', {
        id: noteId
    }).then((res: response<Boolean>) => {
        if (res.status !== 200) {
            return;
        }
        let data = res.data.data;
        if (data === true) {
            message.error("删除成功", {
                icon: () => h(NIcon, null, { default: () => h(NotificationsCircle) })
            })
            reload();
        }
    })
}
</script>

<style></style>